<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>    
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
	List<TOrderDetail> todList=(List<TOrderDetail>)session.getAttribute("orderDetailList");
%>
<%@page import="com.zb.model.*" %>
<%@page import="java.util.*" %>
<%@page import="com.zb.model.TOrderDetail" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link rel="shortcut icon" href="<%=basePath%>static/logo.png">
	<link rel="stylesheet" href="<%=basePath%>static/css/iconfont.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/global.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/bootstrap.min.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/swiper.min.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/styles.css">
	<link rel="stylesheet" href="<%=basePath %>/static2/assets/layer/skin/layer.css">
	<script src="<%=basePath%>static/js/jquery.1.12.4.min.js" charset="UTF-8"></script>
	<script src="<%=basePath%>static/js/bootstrap.min.js" charset="UTF-8"></script>
	<script src="<%=basePath%>static/js/swiper.min.js" charset="UTF-8"></script>
	<script src="<%=basePath%>static/js/global.js" charset="UTF-8"></script>
	<script src="<%=basePath%>static/js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
	<script src="<%=basePath %>/static2/assets/layer/layer.js" charset="UTF-8"></script>	
	<script type="text/javascript">
	
	//查询到所有的商品信息
	$(document).ready(function(){
    	var goodid='<%=request.getParameter("goodid")%>';
    	//alert(goodid);
    	var theme='<%=session.getAttribute("username")%>';
		 //alert(theme);
		 if(theme==null||theme=="null"){
			 $("#dengluzhuce").show(); 
			 $("#tuichudenglu").hide();
			 $("#xianshi").hide();
		 }else{
			 $("#dengluzhuce").hide();  
			 $("#tuichudenglu").show();
		 }
		 /*
		 $.ajax({
				type:"POST",
				url:"../web/SelectShopCart",
				//data:{userid:userid},
				//dataType:"json",
				success:function(data){
					//alert("ajax");
					
				}
			});
		 */
	});
	
	function queren(){
		//获取到选中的地址
		var number = $('input[name="addr"]:checked ').val();
		alert("finded"+number);
		str=number; //这是一字符串 
	    var strs= new Array(); //定义一数组 
	    strs=str.split(","); //字符分割 
	   // for (i=0;i<strs.length ;i++ ) { 
	   //     alert(strs[i]);
	   // } 
	    var shoujianname=strs[0];
	    var target=strs[1];
	    var shoujianphone=strs[2];
	    //alert(shoujianname+"--"+target+"--"+shoujianphone);
	    
	    
	}
	function tijiao(){
		//获取到选中的地址
		var number = $('input[name="addr"]:checked ').val();
		//alert("finded"+number);
		str=number; //这是一字符串 
	    var strs= new Array(); //定义一数组 
	    strs=str.split(","); //字符分割 
	   // for (i=0;i<strs.length ;i++ ) { 
	   //     alert(strs[i]);
	   // } 
	    var shoujianname=strs[0];
	    var target=strs[1];
	    var shoujianphone=strs[2];
	    //alert(shoujianname+"--"+target+"--"+shoujianphone);
	    var goodsName=$("#gn").text();
	    var danjia=$("#dj").text();
	    var shuliang=$("#sl").text();
	    var shifukuan=$("#sf").text();
	    var goodsid=<%=request.getParameter("goodsId") %>;
	    
	    //alert(goodsName+""+danjia+""+shuliang+""+shifukuan+""+goodsid);
		layer.confirm('确认无误？',function(index){
			$.ajax({
				type:"POST",
				url:"../web/addorderX",
				data:{phone:shoujianphone,target:target,goodsname:goodsName,danjia:danjia,shuliang:shuliang,shifukuan:shifukuan,shoujianrenname:shoujianname},
				//dataType:"json",
				success:function(data){
					alert("添加成功");
				}
			});
			/*
			$.ajax({
				type:"POST",
				url:"../web/DelGoodsInSc",
				data:{goodId:goodsid},
				//dataType:"json",
				success:function(data){
					//alert("成功");
					
				}
			});
			*/
			layer.msg('订单提交成功!',{icon:1,time:1000});
			window.location.href="../web/getorders";
		});
		
	}
	
	</script>
	<title>卓越图书网</title>
	<base href="<%=basePath%>jsp/"/>
</head>
<body>
	<!-- 顶部tab -->
	<div class="tab-header">
		<div class="inner">
			<div class="pull-left">
				<div class="pull-left">嗨，欢迎来到<span class="cr">卓越图书网</span>
					<span id="xianshi">尊敬的<%System.out.println(session.getAttribute("username")); %></span>
				</div>
				
			</div>
			<div class="pull-right" id="dengluzhuce">
				<a href="<%=basePath%>jsp/login.jsp"><span class="cr">登录</span></a>
				<a href="<%=basePath%>jsp/login.jsp?p=register">注册</a>
			</div>
			<div class="pull-right" id="tuichudenglu">
			    <a href="<%=basePath%>jsp/udai_welcome.jsp"><span class="cr">个人中心</span></a>
				<a href="<%=basePath%>jsp/login.jsp"><span class="cr">退出登录</span></a>
			</div>
		</div>
	</div>
	<!-- 顶部标题 -->
	<div class="bgf5 clearfix">
		<div class="top-user">
			<div class="inner">
				<a class="logo" href="<%=basePath%>jsp/homePage.jsp"><img src="<%=basePath%>static/images/icons/logo.png" alt="卓越图书网" class="cover"></a>
				<div class="title">购物车</div>
			</div>
		</div>
	</div>
	<div class="content clearfix bgf5">
		<section class="user-center inner clearfix">
			<div class="user-content__box clearfix bgf">
				<div class="title">购物车-确认订单 </div>
				<div class="shop-title">收货地址</div>
				<!-- 
					<a id="querenpay" onclick="queren()">确认订单前期</a>
				 -->
				
					<div class="addr-radio">
						<c:forEach  items="${areaList}" var="area" >
							<div class="radio-line radio-box ">
								<label class="radio-label ep" title="area">
									<input name="addr" checked="" value="${area.shoujianren},${area.suozaidi }${area.xiangxi },${area.shoujianphone }" autocomplete="off" type="radio"><i class="iconfont icon-radio"></i>
									${area.shoujianren}收--${area.suozaidi }--${area.xiangxi }--${area.shoujianphone }
								</label>
								<a href="udai_address_edit.jsp?shoujianren=${area.shoujianren}&suozaidi=${area.suozaidi }&xiangxi=${area.xiangxi }&shoujianphone=${area.shoujianphone }&areaid=${area.areaID }" class="but but-primary">修改</a>
							</div>
						</c:forEach>
						
					</div>
					<div class="add_addr"><a href="udai_address.jsp">添加新地址</a></div>
					<div class="shop-title">确认商品信息</div>
					
					<div class="shop-order__detail">
						<table class="table">
							<table class="table table-bordered">
						<thead>
							<tr>
								<th width="300">商品图片</th>
								<th width="300">商品编号</th>
								<th width="300">商品价格</th>
								<th width="300">商品数量</th>
								<th width="200">总价</th>
							</tr>
						</thead>
						<tbody>
							<c:forEach items="<%=todList %>" var="tod">
								<tr>
									<th scope="row">
										<label class="checked-label">
											<div class="img"><img src="<%=basePath%>${tod.imgPth}" style="width: 200px;height: 150px" alt="" class="cover"></div>
										</label>
										
									</th>
									
									<td>
										<div class="name ep3">${tod.goodsId}</div>
									</td>
									
									<td>
										<div class="name ep3">${tod.price }</div>
									</td>
									
									<td>
										<div class="name ep3">${tod.number }</div>
									</td>
									<td>¥ ${tod.price * tod.number}</td>
								</tr>
							</c:forEach>
						</tbody>
					</table>
						</table>
					</div>
					<div class="shop-title" style="float:right;margin-bottom: 100px;">总价：${sum}</div>
					<div class="pay-mode__box">
						<div class="radio-line radio-box">
							<label class="radio-label ep">
								<input name="pay-mode" value="1" autocomplete="off" type="radio"><i class="iconfont icon-radio"></i>
								<span class="fz16">余额支付</span><span class="fz14"></span>
							</label>
							<div class="pay-value">支付<b class="fz16 cr">¥${sum}</b></div>
						</div>
						<div class="radio-line radio-box">
							<label class="radio-label ep">
								<input name="pay-mode" value="2" autocomplete="off" type="radio"><i class="iconfont icon-radio"></i>
								<img src="<%=basePath%>static/images/icons/alipay.png" alt="支付宝支付">
							</label>
							<div class="pay-value">支付<b class="fz16 cr">¥${sum}</b></div>
						</div>
						<div class="radio-line radio-box">
							<label class="radio-label ep">
								<input name="pay-mode" value="3" autocomplete="off" type="radio"><i class="iconfont icon-radio"></i>
								<img src="<%=basePath%>static/images/icons/paywechat.png" alt="微信支付">
							</label>
							<div class="pay-value">支付<b class="fz16 cr">¥${sum}</b></div>
						</div>
					</div>
					<div class="user-form-group shopcart-submit">
						
						<button type="" class="btn" id="zhifu" onclick="tijiao()">确认订单</button>
					</div>
					<script>
						$(document).ready(function(){
							$(this).on('change','input',function() {
								$(this).parents('.radio-box').addClass('active').siblings().removeClass('active');
							})
						});
					</script>
			</div>
		</section>
	</div>
	<!-- 右侧菜单 -->
	<div class="right-nav">
		<ul class="r-with-gotop">
			<li class="r-toolbar-item">
				<a href="udai_welcome.jsp" class="r-item-hd">
					<i class="iconfont icon-user" data-badge="0"></i>
					<div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="udai_shopcart.jsp" class="r-item-hd">
					<i class="iconfont icon-cart"></i>
					<div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="udai_collection.jsp" class="r-item-hd">
					<i class="iconfont icon-aixin"></i>
					<div class="r-tip__box"><span class="r-tip-text">我的收藏</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="" class="r-item-hd">
					<i class="iconfont icon-liaotian"></i>
					<div class="r-tip__box"><span class="r-tip-text">联系客服</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="issues.jsp" class="r-item-hd">
					<i class="iconfont icon-liuyan"></i>
					<div class="r-tip__box"><span class="r-tip-text">留言反馈</span></div>
				</a>
			</li>
			<li class="r-toolbar-item to-top">
				<i class="iconfont icon-top"></i>
				<div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
			</li>
		</ul>
		<script>
			$(document).ready(function(){ $('.to-top').toTop({position:false}) });
		</script>
	</div>
	<!-- 底部信息 -->
	<div class="footer">
		<div class="footer-tags">
			<div class="tags-box inner">
				<div class="tag-div">
					<img src="<%=basePath%>static/images/icons/footer_1.gif" alt="厂家直供">
				</div>
				<div class="tag-div">
					<img src="<%=basePath%>static/images/icons/footer_2.gif" alt="一件代发">
				</div>
				<div class="tag-div">
					<img src="<%=basePath%>static/images/icons/footer_3.gif" alt="名誉出品">
				</div>
				<div class="tag-div">
					<img src="<%=basePath%>static/images/icons/footer_4.gif" alt="信誉认证">
				</div>
			</div>
		</div>
		<div class="footer-links inner">
		</div>
		<div class="copy-box clearfix">
			<!-- 版权 -->
			<p class="copyright">
					© 2019-2020 卓越图书网 版权所有，并保留所有权利<br>
			</p>
		</div>
	</div>
</body>
</html>